<template>
  <div class="container">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-alert
          v-if="strings.isNotBlank(propMsgTop)"
          type="warning"    effect="dark" class="alert-top"
          :closable="false">
          <i class="el-icon-info"  >{{propMsgTop}}</i>
        </el-alert>
      </el-col>
      <el-col :span="12" style="text-align: right">
        <span >
          <strong>已选单品</strong>
          <span class="span-num">{{skuQtySum}}</span>
        </span>

        <span >
          <strong>已选包装</strong>
          <span class="span-num">{{packageQtySum}}</span>
        </span>

        <span >
          <strong>已选金额</strong>
          <span class="span-num">{{amountSum}}</span>
        </span>
      </el-col>
    </el-row>

    <data-view
      :propViewKey="propViewKey"
      :propSubHeight="strings.isNotBlank(propMsgTop) ? 30 : 0"
      @extra-button-click="extraButtonClick"
      @checkbox-change="checkboxAllChange"
      @checkbox-all="checkboxAllChange"
      @after-load="checkboxAllChange"
      ref="dataview"
    />
  </div>
</template>

<script>
import utilBill from './utilBill.js'

export default {
  name: 'highLowModel',
  remark: '高低值公用入账界面',
  data() {
    return {
      skuQtySum: 0,
      packageQtySum: 0,
      amountSum: 0,
    }
  },
  props: [
    //视图标识
    'propViewKey',

    //顶部提示信息
    'propMsgTop',

    //类型 high:高值，low:地址
    'propPrintType',
  ],
  methods: {
    //扩展按钮
    extraButtonClick(para) {
      let buttonKey = para.button.key
      switch (buttonKey) {
      case 'print': //打印消耗清单
      {
        if (!para.data || para.data.length < 1) {
          this.utilMessage.warning('请先选择需要操作的数据，然后再进行操作')
          return
        }
        this.utilMessage.confirm('是否入账所选择的数据', () => {
          this.print(para.data)
        })
        break
      }
      case 'printAll': //打印消耗清单
      {
        this.utilMessage.confirm('是否入账当前所有查询条件的相关数据', () => {
          this.printAll()
        })
        break
      }
      default:
        // eslint-disable-next-line no-alert
        alert('未实现')
      }
    },

    //打印消耗清单
    print(rows) {
      let itemIds = []
      rows.forEach(row => itemIds.push(row.itemId))
      let param = {
        itemIds: itemIds.join(','),
        printType: this.propPrintType,
      }
      this.utilVue.loadShow(true)
      this.$ajax.post('/finance/bill/billPrint', param).then(resp => {
        this.utilVue.loadHide()
        if (resp.success) {
          this.utilMessage.success(resp.msg, 5000)
          this.$refs.dataview.ocRefresh()
          this.utilMessage.confirm('是否打印已入账数据', () => {
            utilBill.printBatch(resp.data, this)
          })
        }
      })
    },

    //打印消耗清单
    printAll() {
      let param = {
        printType: this.propPrintType,
        queryString: this.$refs.dataview.generateQuery(false, null),
      }
      this.utilVue.loadShow(true)
      this.$ajax.post('/finance/bill/billPrintAll', param).then(resp => {
        this.utilVue.loadHide()
        if (resp.success) {
          this.utilMessage.success(resp.msg, 5000)
          this.$refs.dataview.ocRefresh()
          this.utilMessage.confirm('是否打印已入账数据', () => {
            utilBill.printBatch(resp.data, this)
          })
        }
      })
    },

    //复选按钮
    checkboxAllChange() {
      this.skuQtySum = 0
      this.packageQtySum = 0
      this.amountSum = 0
      let rows = this.$refs.dataview.$refs.tbMain.getCheckboxRecords()
      if (rows) {
        rows.forEach(row => {
          this.skuQtySum = this.utilNum.numAdd(row.skuQty, this.skuQtySum)
          this.packageQtySum  = this.utilNum.numAdd(row.packageQty, this.packageQtySum)
          this.amountSum  = this.utilNum.numAdd(row.amount, this.amountSum)
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .span-num{
    width: 100px;
    display: inline-block;
    padding-left: 5px;
    text-align: left;
  }
</style>
